<!DOCTYPE HTML>
<html xmlns:v-if="http://www.w3.org/1999/html">
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <link rel="Bookmark" href="/favicon.ico" >
    <link rel="Shortcut Icon" href="/favicon.ico" />
    <script type="text/javascript" src="/lib/html5shiv.js"></script>
    <script type="text/javascript" src="/lib/respond.min.js"></script>
    <script type="text/javascript" src="/js/vue/vue.min.js"></script>
    <link rel="stylesheet" type="text/css" href="/h-ui/css/H-ui.min.css" />
    <link rel="stylesheet" type="text/css" href="/h-ui.admin/css/H-ui.admin.css" />
    <link rel="stylesheet" type="text/css" href="/lib/Hui-iconfont/1.0.8/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="/h-ui.admin/skin/default/skin.css" id="skin" />
    <link rel="stylesheet" type="text/css" href="/h-ui.admin/css/style.css" />
    <script type="text/javascript" src="/lib/respond.min.js"></script>

    <title>管理员列表</title>
</head>
<body>
<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span> 管理员管理 <span
        class="c-gray en">&gt;</span> 管理员列表 <a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px"
                                               href="javascript:location.replace(location.href);" title="刷新"><i
        class="Hui-iconfont">&#xe68f;</i></a></nav>
<div class="page-container">
    <div class="text-c">
        <input type="text" class="input-text" style="width:250px" placeholder="搜索用户名、员工姓名、手机号" id="poSupName" name="">
        <button type="submit" class="btn btn-success" id="findempl" name=""><i class="Hui-iconfont">&#xe665;</i>搜订单</button>
    </div>
    <div class="cl pd-5 bg-1 bk-gray mt-20">
        <a href="javascript:;" id="deleteall"  class="btn btn-danger radius"><i class="Hui-iconfont">&#xe6e2;</i> 批量删除</a>
        <a href="javascript:;" id="addUserBtn" class="btn btn-primary radius"><i class="Hui-iconfont">&#xe600;</i>新增员工</a>
        <a href="javascript:;" id="doFile" class="btn btn-success radius">
        <i class="Hui-iconfont">&#xe644;</i> Excel导出</a>
    </span>

        <span class="r">共有数据：<strong id="strong"></strong> 条</span></div>
    <div id="app" style="overflow: scroll;height: 500px"  >
        <table class="table table-border table-bordered table-bg">
            <thead>
            <tr>
                <th scope="col" colspan="11">员工列表</th>
            </tr>
            <tr class="text-c">
                <th width="25"><input type="checkbox" id="check" name="" value=""></th>
                <th width="40">序号</th>
                <th width="130">操作</th>
                <th width="150">用户名</th>
                <th width="150">员工姓名</th>
                <th width="90">角色</th>
                <th width="90">性别</th>
                <th width="130">手机号</th>
                <th width="150">邮箱</th>
                <th width="100">状态</th>
                <th width="100">地址</th>

            </tr>
            </thead>
            <tbody v-for="(item,index) in result">
            <tr class="text-c" >
                <td><input type="checkbox" :value=item.id  name="aid"></td>
                <td>{{index+1}}</td>
                <td class="td-manage">
                    <a style="text-decoration:none" class="ml-5" @click="updateemp(item.id)"  title="编辑">
                        <i class="Hui-iconfont">&#xe6df;</i>
                    </a>
                    <a id="del" title="删除" href="javascript:;" @click="delEvent(item.id)" class="ml-5" style="text-decoration:none">
                        <i class="Hui-iconfont">&#xe6e2;</i>
                    </a>
                    <a title="详情" href="#" class="ml-5" @click="detail(index)"style="text-decoration:none">
                        <i class="icon Hui-iconfont">&#xe627;</i>
                    </a>
                </td>
                <td>{{item.emUsername}}</td>
                <td>{{item.emRealname}}</td>
                <td>{{item.emRole}}</td>
                <td>{{item.emSex}}</td>
                <td>{{item.emPhone}}</td>
                <td>{{item.emEmail}}</td>
                <td>{{item.emStatus}}</td>
                <td>{{item.emAddress}}</td>

            </tr>
            <tr class="row0_detail" style="display: none"  ><td colspan="20" align="left">
                <table style="padding:0 0 0px 0px;margin: 0px 0px 10px 0px;" border="0" cellspacing="0" cellpadding="0" class="noborderTable" >
                    <tbody>
                    <tr>
                        <td style="border-bottom:1px solid #d7d7d7" colspan="">
                            <template v-if="item.emRole=='管理员'">
                            <h4 class="fl" style="line-height:20px;">管理组</h4>&nbsp;&nbsp;
                            </template>
                            <template v-if="item.emRole=='仓管员'">
                                <h4 class="fl" style="line-height:20px;">仓管组</h4>&nbsp;&nbsp;
                            </template>
                            <template v-if="item.emRole=='财务员'">
                                <h4 class="fl" style="line-height:20px;">财管组</h4>&nbsp;&nbsp;
                            </template>
                            <template v-if="item.emRole=='销售员'">
                                <h4 class="fl" style="line-height:20px;">销售组</h4>&nbsp;&nbsp;
                            </template>


                            <span style="line-height:35px;" class="font999">用户名:</span>{{item.emUsername}}&nbsp;&nbsp;
                        </td>
                    </tr>
                    <tr>
                        <td style="padding:15px 30px 0px 0;">
                            <span class="font999">角色:</span>{{item.emRole}}
                        </td>
                        <td style="padding:15px 30px 0px 0;">
                            <span class="font999">地址:</span> {{item.emAddress}}
                        </td>
                        <td style="padding:15px 30px 0px 0;">
                            <span class="font999">性别:</span>{{item.emSex}}
                        </td>
                        <td style="padding:15px 30px 0px 0;">
                            <span class="font999">关联仓库:</span>默认仓库</td>
                    </tr>
                    <tr>
                        <td style="padding:15px 30px 0px 0;">
                            <span class="font999">价格权限:</span>{{item.emShiro}}</td>
                        <td style="padding:15px 30px 0px 0;">
                            <span class="font999">状态:</span>{{item.emStatus}}</td>
                        <td style="padding:15px 30px 0px 0;">
                            <span class="font999">手机号:</span> {{item.emPhone}} </td>
                        <td style="padding:15px 30px 0px 0;">
                            <span class="font999">查看他人单据:</span>{{item.emSelInvoice}}</td>
                    </tr>
                    <tr>
                        <td style="padding:15px 30px 0px 0;">
                            <span class="font999">作废他人单据:</span>{{item.emDelInvoice}}</td>
                        <td style="padding:15px 30px 0px 0;">
                            <span class="font999">查看他人客户:</span>{{item.emSelUser}}</td>
                        <td style="padding:15px 30px 0px 0;">
                            <span class="font999">邮箱:</span> {{item.emEmail}}
                        </td>
                    </tr>
                    </tbody>
                </table>
            </td>
            </tr>

            </tbody>
        </table>
    </div>
    <div id="pagenav" style="text-align: center"></div>
</div>
<script type="text/javascript" src="/lib/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="/lib/layer/2.4/layer.js"></script>
<script type="text/javascript" src="/h-ui/js/H-ui.min.js"></script>
<script type="text/javascript" src="/h-ui.admin/js/H-ui.admin.js"></script>
<script type="text/javascript" src="/lib/My97DatePicker/4.8/WdatePicker.js"></script>
<script type="text/javascript" src="/lib/datatables/1.10.0/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="/lib/laypage/1.2/laypage.js"></script>
<script type="text/javascript">
    var app = new Vue({
        el:'#app',
        data:{
            result:[]
        }

    });
    var detail =function (as) {
        var a=$(".row0_detail")
        if (a[as].style.display=="none"){
            a[as].style.display="";
        } else {
            a[as].style.display="none";
        }
    }

    var getUserPageList = function(curr) {
        $.ajax({
            type:'get',
            dataType:'json',
            url:'/systemsetup/employ/selectpage',
            data:{
                pageNum: curr || 1,
                pageSize:10,
                emUsername:$("#poSupName").val(),
                emPhone:$("#poSupName").val(),
                emRealname:$("#poSupName").val(),

            },
            success:function(msg){
                $("#strong").html(msg.total);
                app.result = msg.list;
                laypage({
                    cont:'pagenav',
                    pages:msg.totalPage,
                    first:'首页',
                    last:'尾页',
                    skin: '#00A0E9',
                    curr: curr || 1,
                    jump: function (obj, first) {
                        if (!first) {
                            getUserPageList(obj.curr);
                        }
                    }
                });
            }
        });
    }
    getUserPageList();
    /*查询用户*/
    $("#findempl").click(function () {
        getUserPageList();
    });

    /*增加用户*/
    $("#addUserBtn").click(function () {
        layer.open({
            type:2,
            title:'新增员工',
            fix:false,
            maxmin:true,
            shadeClose:true,
            area:['1200px','800px'],
            content:'/systemsetup/employ/addempl',
            end:function() {
                getUserPageList();
            }
        });
    });
    /*
    删除员工
     */
    var delEvent = function (id) {
        layer.confirm('你确定要删除吗？',{
            btn:['是','否']
        },function () {
            $.ajax({
                type:'GET',
                url: '/systemsetup/employ/deleteempl',
                data:{
                    id:id
                },
                success:function (msg) {
                    layer.msg('成功删除',{icon:1});
                    getUserPageList();
                }
            })
        },function () {

        });
    };
    /**
     *
     * 批量删除
     */
    $("#deleteall").click(function () {
        var arr = new Array();
        $("input:checkbox[name='aid']:checked").each(function (i) {
            arr[i]=$(this).val();
        });
        if (arr[0]==null){
            layer.msg("请选择勾选要删除的行列！",{time:2000,icon:2})
        }else {
            layer.confirm('你确定要删除吗？',{
                btn:['是','否']
            }, function () {
                for (var c = 0; c < arr.length; c++) {
                    alert(1)
                    $.ajax({
                        type: 'GET',
                        url: '/systemsetup/employ/deleteempl',
                        data: {
                            id: arr[c],
                        },
                        success: function (msg) {
                            layer.msg('成功删除', {icon: 1});
                            getUserPageList();
                        }
                    })
                    $("input:checkbox[name='aid']:checked").attr("checked",false);
                }
            })

        }



    })
    /*Excel导出*/
    $("#doFile").click(function () {
        window.location.href="/systemsetup/employ/export";
    })
    /*修改员工*/
   var updateemp =function (id) {
       alert('nihao')
       layer.open({
           type:2,
           title:'修改员工',
           fix:false,
           maxmin:true,
           shadeClose:true,
           area:['1200px','800px'],
           content:'/systemsetup/employ/updateempl?id='+id,
           end:function() {
               getUserPageList();
           }
       });
   }



</script>
</body>
</html>